<!--
   svg.html

   Copyright 2018 fhz8 <fhz8@fhz8-IdeaPad>

   This program is free software; you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
   the Free Software Foundation; either version 2 of the License, or
   (at your option) any later version.

   This program is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.

   You should have received a copy of the GNU General Public License
   along with this program; if not, write to the Free Software
   Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
   MA 02110-1301, USA.


-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>svg</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta name="generator" content="Geany 1.32" />
	<link type="text/css" rel="stylesheet" href="/static/mystyle.css">
	<script src="/static/jquery.min.js" type="text/javascript"></script>
	<script src="static/before.js" type="text/javascript"></script>
</head>

<body onload="loadFlow()">
<div style="vertical-align:top">
	<div class="block1">
        <div><input type="button" value="新建流程图" onclick='showOperate("newFlow")'/></div>
        <div id='newFlow'  style='display:none'>
			<p>新建流程图：</p>
			<form id="formNewFlow" action="/new_flow" method="post">
				<input type="text" name="flow" value=""/>
				<input type="submit" value="提交"/>
			</form>
		</div>
		<ul>
			<li><h3>流程图列表：</h3></li>
			{{range .Flows}}<li><a href="/index?flow={{.Id}}">{{.Title}}</a></li>{{end}}
		</ul>
	</div>

	<div class="block1">
		<input type="hidden" id="flowID" name="flow" value="{{.Flow}}"/>
		<div>
			<select id="selFlowID">
				{{range .Flows}}<option value={{.Id}}>{{.Title}}</option>{{end}}
			</select><a href="" id="downLink">下载矢量图</a>
		</div>
		<ul>
			<li style="color:#FF0000">红色：不能开始</li>
			<li style="color:#00FF00">绿色：可以开始</li>
			<li style="color:#0000FF">蓝色：正在进行</li>
			<li style="color:#000000">黑色：已经完成</li>
		</ul>
		<embed id="svg1" src="" type="image/svg+xml" onload="setSVG()"/><br/>
		<input type="button" value="新建节点" onclick='showOperate("newNode")'/>
		<input type="button" value="更新节点" onclick='showOperate("updateNode")'/>
		<input type="button" value="交换序号" onclick='showOperate("swapNode")'/>
		<input type="button" value="删除节点" onclick='showOperate("delNode")'/>
		<div id='swapNode' style='display:none'>
			<p>交换序号：</p>
			<form id="formSwap" action="/swap_idx" method="post">
			Node ID 1: <input type="text" value="" id="id1" name="id1" onclick="click_input(this)"/>
      <input type="button" value="选择节点" onclick='setSwapId("id1")'/><br/>
			Node ID 2: <input type="text" value="" id="id2" name="id2" onclick="click_input(this)"/>
      <input type="button" value="选择节点" onclick='setSwapId("id2")'/><br/>
			</form>
			<input type="hidden" value="id1" id="inputid"/>
			<input type="button" value="交换" onclick="swapIndex()"/>
		</div>
		<div id='newNode'  style='display:none'>
			<p>新建节点：</p>
			<form id="formNew" action="/new_node" method="post">
				<input type="hidden" id="newJSON" name="json" value=""/>
			</form>
				名称：<input type="text" name="name" id="newName"/><br/>
				状态：
				<select id="newStatus" name="status">
					<option value=0>不能开始</option>
					<option value=1>可以开始</option>
					<option value=2>正在进行</option>
					<option value=3>完成</option>
				</select><br/>
			<input type="button" onclick='selectDepend("group1")' value="点击选择依赖节点"/>
			<optgroup id="group1" label="依赖节点">
			</optgroup><br/>
			<input type="button" value="submit" onclick='newNode()' />
		</div>
		<div id='updateNode'  style='display:none'>
			<p>点击右侧按钮后点选节点：<input type="button" id="selectNode" value="选择节点"/></p>
			<form id="formUpdate" action="/update_node" method="post">
				<input type="hidden" id="updateJSON" name="json" value=""/>
			</form>
				<input type="hidden" id="updateID" value="0"/>
			名称：<input type="text" name="name" id="updateName"/><br/>
			状态：
				<select id="updateStatus" name="status">
					<option value=0>不能开始</option>
					<option value=1>可以开始</option>
					<option value=2>正在进行</option>
					<option value=3>完成</option>
				</select><br/>
				<input id="updateDepend" name="depend" type="hidden" value=""/>

			<input type="button" onclick='selectDepend("group2")' value="点击选择依赖节点"/>
			<optgroup id="group2" label="依赖节点">
			</optgroup><br/>
			<input type="button" value="submit" onclick='updateNode()' />
		</div>
		<div id='delNode'  style='display:none'>
		点击节点以删除，只能删除孤立节点。
		</div>
		<script src="/static/after.js" type="text/javascript"></script>
	</div>
</div>
</body>

</html>
